*{
    margin: 0;
    padding: 0;
    list-style: none;
    outline: none
}
.banner{
    position: relative;
    width: 1520px;
    height: 700px;
    background: url(img/banner.jpg)no-repeat center center / 100% 100%
}
.tou{
    height:50px ;
    width:1000px;
    position: absolute;
    top: 50px;
    left: 280px;
}
.zuo{
    float: left;
    height: 100%;
    width: 250px;
    background: url(img/logo.png)no-repeat center center / 100% 100%
}
.ul{
    float: right;
    height: 50%;
    width: 580px;
    margin-top: 10px

}
.ul li{
    float: left;
    margin: 0 16px;
    color: white

}
.zhong{
    width: 140px;
    height: 160px;
    position: absolute;
    background:url(img/liu1.png)no-repeat center center / 100% 100%;
    left: 700px;
    top:130px
    
}
.zhong2{
    width: 140px;
    height: 160px;
    position: absolute;
    background:url(img/liu2.png)no-repeat center center / 100% 100%;
    left: 700px;
    top:210px
    
}
.zhong3{
    width: 70px;
    height: 75px;
    position: absolute;
    background:url(img/liu3.png)no-repeat center center / 100% 100%;
    left: 735px;
    top:178px
    
}
.zhong4{
    width: 5px;
    height: 5px;
    position: absolute;
    animation: dian 1s .5s ease-in infinite;
    left: 735px;
    top:220px 
    
}
@keyframes dian{

    0%{
      top:220px
      }   

    100%{
      top:180px
      }
}
.zhong5{
    width: 5px;
    height: 5px;
    position: absolute;
    animation: dian1 1s .2s ease-in infinite ;
    left: 750px;
    top:230px 
    
}
@keyframes dian1{

    0%{
      top:230px
      }   

    100%{
      top:180px
      }
}
.zhong6{
    width: 5px;
    height: 5px;
    position: absolute;
    animation: dian2 1s .5s ease-in infinite ;
    left: 770px;
    top:235px 
    
}
@keyframes dian2{

    0%{
      top:235px
      }   

    100%{
      top:180px
      }
}
.zhong7{
    width: 5px;
    height: 5px;
    position: absolute;
    animation: dian 1s .22s ease-in infinite ;
    left: 790px;
    top:220px 
    
}
@keyframes dian{

    0%{
      top:220px
      }   

    100%{
      top:180px
      }
}
.wenzi{
    position: absolute;
    height: 200px;
    width: 800px;
    background: url(img/wezi.png)no-repeat center center / 100% 100%;
    background-size:550px; 
    top:400px;
    left: 360px;
}
.shouji{
    position: absolute;
    height: 50px;
    width: 210px;
    background: url(img/shouji,png.png)no-repeat center center / 100% 100%;
    top:600px;
    left: 540px;
}
.shouji2{
    position: absolute;
    height: 50px;
    width: 210px;
    background: url(img/shouji,png.png)no-repeat center center / 100% 100%;
    top:600px;
    left: 780px;
}

.banner2{
    position: relative;
    width: 1520px;
    height: 700px;
    background: url(img/beijing.png)no-repeat center center;
    background-size: 600px;
}
.shaonv{
    position: absolute;
    height: 100px;
    width: 400px;
    background: url(img/shaonv.png)no-repeat center center;
    background-size:200px;
    left:400px ;
    top: 300px;
    
}
.jiao{
    position: absolute;
    height: 70px;
    width: 100px;
    background: url(img/jiao.png)no-repeat center center;
    background-size:90px;
    left:610px ;
    top: 350px;
    transform: rotate(12deg);
    transform-origin: 11px -11px;
    animation: jiao 2s infinite linear forwards alternate-reverse;
}
@keyframes jiao {
    from {
        transform: rotate(12deg)
    }
    to {
        transform: rotate(-10deg)
    }
}
.banner3{
    position: relative;
    width: 1520px;
    height: 700px;
    background: url(img/piaofu.png)no-repeat center center;
    background-size: 600px;
}
.piaofu{
    position: absolute;
    height: 200px;
    width: 400px;
    background: url(img/xing.png)no-repeat center center;
    background-size:300px;
    left:400px ;
    top: 250px;
    animation: xing 1s infinite linear alternate-reverse
}
@keyframes xing {
    0%{
        left:400px ;
        top: 250px;
    }
    50%{
        left:410px ;
        top: 245px;
    }

    100% {
        left:405px ;
        top: 245px;
    }
}